﻿<%@ Page Title="" Language="C#" MasterPageFile="~/Site.Master" AutoEventWireup="true" CodeBehind="FlexibleDialog.aspx.cs" Inherits="SCS.Web.UI.WebControls.Dialogs.Test.FlexibleDialog" %>
<%@ Register assembly="SCS.Web.UI.WebControls.Dialogs" namespace="SCS.Web.UI.WebControls.Dialogs" tagprefix="cc1" %>
<%@ Register assembly="AjaxControlToolkit" namespace="AjaxControlToolkit" tagprefix="act" %>

<asp:Content ID="Content1" ContentPlaceHolderID="HeadContent" runat="server">
    <link href="Help/Help.css" rel="stylesheet" type="text/css" />
</asp:Content>

    <asp:Content ID="Content2" ContentPlaceHolderID="MainContent" runat="server">

    <h2>Flexible Dialog</h2>

    <h3>Project Overview</h3>

    <p>The FlexibleDialog control is an ASP.NET control that allows you to create complex dialogs containing multiple forms 
        loaded from a Web service or Web server. The FlexibleDialog makes multi-form dialog development easier by handling 
        the logistics of client-side navigation and data persistence between the multiple forms hosted within a single dialog.         
    </p>

    <p>
        To see a demonstration of the Flexible Dialog, click the Login link above. The markup for the dialog is shown below.
    </p>

    <div class="code-box">
    <pre>
    &lt;a id=&quot;loginLink&quot; dialog-open=&quot;{url: 'membership/login.htm'}&quot;&gt;Log In&lt;/a&gt;

    &lt;cc1:FlexibleDialog ID=&quot;Dialog1&quot; runat=&quot;server&quot;        
        CssClass=&quot;dialog&quot;
        BackgroundCssClass=&quot;modalBackground&quot;         
        Title=&quot;&quot;               
        ShowTitlebarCloseButton=&quot;true&quot;
        ShowCloseButton=&quot;false&quot; 
        ShowOkButton=&quot;false&quot; /&gt;
    </pre>
    <div class="caption">Flexible Dialog Example Markup</div>
    </div>

    <h3>Architecture</h3>
    
    <p>The FlexibleDialog control extends the SCS.Web.UI.WebControls.DialogControl class (which serves as the 
        base class control for all other dialogs in the AjaxDialogToolkit), and in turn it extends the 
        ScriptControlBase from the AjaxControlToolkit. Internally, the FlexibleDialog client scripts consume the 
        AjaxControlToolkit ModalPopupExtender's client behavior script and utilizes the jQuery core library.         
    </p>
    
    <p>As mentioned above, the FlexibleDialog loads its forms from WebServices and Web Servers. The forms loaded via Web service 
       are handled by the embedded ModalPopupBehavior; whereas, the static content is loaded using the Sys.Net.WebRequest object 
       within SCS.DialogControl base script. A nice technique for sending dynamic HTML to the FlexibleDialog is to use UserControls 
       through the Web service where the requests are forwarded to a class where the control is instantiated, rendered, 
       and streamed back out through the Web service. This class was blogged about by Scott Guthrie and is named HtmlBuilder (for lack of a better name) 
       in this project.
    </p>

    <p>When a new form is loaded by the FlexibleDialog, an event handler is assigned to each navigation elements defined within the form. 
        This event handler is used to load subsequent forms. The navigational elements are defined by the "dialog-action" expando 
        attribute, which in addition to indicating it's a navigation element, supplies additional information that tells the 
        FlexibleDialog where to get the content for the next form. 
    </p>

    <a dialog-open="{url: 'help/guide.htm'}">Development Guide</a> 

</asp:Content>
